import React, { Component } from 'react';
import TheQueryForm from '@/components/TheQueryForm'
import { apiGetServiceData } from "@/request/hotelRoomStatus";
import Room from './Room'
import moment from "moment";
export default class HotelRooms extends Component {
    constructor(props) {
        super(props)
        this.queryFormRef = React.createRef()
        this.state = {
            searchOption: [
                // { field: 'beginTime', label: '入住时间', placeholder: '请选择入住时间', required: false, rules: [], type: 'DatePicker', initialValues:moment(), disabledDate:this.disabledDate },
                // { field: 'endTime', label: '离店时间', placeholder: '请选择离店时间', required: false, rules: [], type: 'DatePicker', initialValues: moment().add(1, 'days'),disabledDate:this.disabledDateOut },
                { field: 'time', label: '入住-离店', placeholder: '请选择', required: false, rules: [], type: 'RangePicker', initialValues: [moment(), moment().add(1, 'days')],disabledDate:this.disabledDate, onChange: this.onChange},
                { field: 'serviceId', label: '房间类型', placeholder: '请选择房间类型', required: false, rules: [], type: 'Select', options: [{ label: '全部', value: '', }], txt: 'serviceName', value: 'serviceId', api: apiGetServiceData, params: { pageNo:-1, pageSize:-1, serviceStatus:"Y", approvalStatus: "T",serviceClassifyId:this.props.classifyId }, initialValues: '' },
                { field: 'offLineStatus', label: '状态', placeholder: '请选择状态', required: false, rules: [], type: 'Select', options: [{ label: '全部', value: '0', }, { label: '可预订', value: '1', }, { label: '被预留/维修中', value: '2' }, { label: '不可预订', value: '3' }], initialValues: '0' },
            ],
            disabled:false
        }
    }
    componentDidMount() {
    }
    // 入住时间禁止选择
    disabledDate = (current) => {
        // Can not select days before today and today
        // return current && current < moment().startOf('day');
        let tooLate = current && current.diff(moment().subtract(2, 'days'),'days') >1
        let tooEarly = current && current < moment().subtract(2, 'days')
        return !!tooEarly
        // return !!tooLate || !!tooEarly
    };
    // 离店时间禁止选择
    disabledDateOut = (current) =>{
        return current && current < moment().startOf('day');
    }
    // 时间选择回调  不可为同一天
    onChange = (dates,dateStrings)=>{
        if(dateStrings[0] === dateStrings[1]){
            this.setState({
                disabled:true
            })
        }else{
            this.setState({
                disabled:false
            })
        }
    }   
    // 搜索
    onFormSearch(values) {
        this.setState({
            pageData: { pageNo: 1, pageSize: 10 }
        }, () => {
            this.props.getSearch(values)
        })
    }
    // 搜索重置
    onReset() {
        let values = {
            time: [moment(), moment().add(1, 'days')],
            serviceId:"",
            offLineStatus:"0"
        }
        this.setState({
            disabled:false
        })
        this.queryFormRef.formRef.setFieldsValue({ ...values })
        this.props.getSearch(values)
    }
    putCar(item) {
        this.props.putCar(item)
    }
    render() {
        const { searchOption, disabled } = this.state
        const { data } = this.props
        let newData = []
        data.map(item=>{
            if(item.roomInfoVos){
                item.roomInfoVos.map(item2=>{
                    newData.push({...item, ...item2})
                })
            }
        })
        return (
            <div>
                <TheQueryForm ref={(ref) => this.queryFormRef = ref} show={true} option={searchOption}
                    onGetValues={(values) => this.onFormSearch(values)}
                    onReset={(values) => this.onReset(values)}
                    disabled={disabled}
                >
                </TheQueryForm>
                <div className='rooms '>
                    {newData.map(item => 
                        <Room putCar={(e)=>this.putCar(e)} item={item} ></Room>
                    )}
                </div>
            </div>
        );
    }
}
